function flow(mh, mv) { 
    var w = 1162;
   
    var ul = document.getElementById("flow-box"); 
    var li = ul.getElementsByTagName("li"); 
    var iw = li[0].offsetWidth + mh;
    var c = Math.floor(w / iw);
    //ul.style.width = iw * c - mh + "px"; 
    ul.style.width=1162+"px";
    var liLen = li.length; 
    var lenArr = []; 
    for (var i = 0; i < liLen; i++) { 
    lenArr.push(li[i].offsetHeight); 
    } 
    
    var oArr = []; 
    for (var i = 0; i < c; i++) { 
    li[i].style.top = "0"; 
    li[i].style.left = iw * i + "px"; 
    li[i].style.opacity = "1"; 
    li[i].style["-moz-opacity"] = "1"; 
    li[i].style["filter"] = "alpha(opacity=100)"; 
    oArr.push(lenArr[i]); 
    } 
    
    for (var i = c; i < liLen; i++) { 
    var x = _getMinKey(oArr); 
    li[i].style.top = oArr[x] + mv + "px"; 
    li[i].style.left = iw * x + "px"; 
    li[i].style.opacity = "1"; 
    li[i].style["-moz-opacity"] = "1"; 
    li[i].style["filter"] = "alpha(opacity=100)"; 
    oArr[x] = lenArr[i] + oArr[x] + mv;
    } 
    document.getElementById("loadimg").style.top = _getMaxValue(oArr) + 50 + "px";//将loading移到下面 
    
    function scroll() { 
    var st = oArr[_getMinKey(oArr)]; 
    var scrollTop = document.documentElement.scrollTop > document.body.scrollTop? document.documentElement.scrollTop : document.body.scrollTop; 
    if (scrollTop >= st - document.documentElement.clientHeight) { 
    window.onscroll = null; 
    _request(null, "GetList.php", function(data) { 
    _addItem(data.d, function() { 
    var liLenNew = li.length; 
    for(var i = liLen; i < liLenNew; i++) { 
    lenArr.push(li[i].offsetHeight); 
    } 
    for(var i = liLen; i < liLenNew; i++) { 
    var x = _getMinKey(oArr); 
    li[i].style.top = oArr[x] + 10 + "px"; 
    li[i].style.left = iw * x + "px"; 
    li[i].style.opacity = "1"; 
    li[i].style["-moz-opacity"] = "1"; 
    li[i].style["filter"] = "alpha(opacity=100)"; 
    oArr[x] = lenArr[i] + oArr[x] + 10; 
    } 
    document.getElementById("loadimg").style.top = _getMaxValue(oArr) + 50 + "px"; 
    liLen = liLenNew; 
    window.onscroll = scroll; 
    }); 
    }) 
    } 
    } 
    window.onscroll =scroll; 
    } 
window.onload = function() {flow(10,10);}; 
var re; 
window.onresize = function() { 
clearTimeout(re); 
re = setTimeout(function() {flow(10, 10);}, 200); 
} 


function _addItem(arr, callback) { 
var _html = ""; 
var a = 0; 
var l = arr.length; 
(function loadimg() { 
var img = new Image(); 
img.onload = function() { 
a += 1; 
if (a == l) { 
for (var k in arr) { 
var img = new Image(); 
img.src = arr[k].img; 
_html += '<li><img src="' + arr[k].img + '" /><a href="#">' + arr[k].title + '</a></li>'; 
} 
_appendhtml(document.getElementById("flow-box"), _html); 
callback(); 
} 
else { 
loadimg(); 
} 
} 
img.src = arr[a].img; 
})() 
} 
 
function _request(reqdata, url, callback) { 
var xmlhttp; 
if (window.XMLHttpRequest) { 
xmlhttp = new XMLHttpRequest(); 
} 
else { 
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
} 
xmlhttp.onreadystatechange = function () { 
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
var data = eval("(" + xmlhttp.responseText + ")"); 
callback(data); 
} 
} 
xmlhttp.open("POST", url); 
xmlhttp.setRequestHeader("Content-Type", "application/json; charset=utf-8"); 
xmlhttp.send(reqdata); 
} 

function _appendhtml(parent, child) { 
if (typeof (child) == "string") { 
var div = document.createElement("div"); 
div.innerHTML = child; 
var frag = document.createDocumentFragment(); 
(function() { 
if (div.firstChild) { 
frag.appendChild(div.firstChild); 
arguments.callee(); 
} 
else { 
parent.appendChild(frag); 
} 
})(); 
} 
else { 
parent.appendChild(child); 
} 
} 
 
function _getMaxValue(arr) { 
var a = arr[0]; 
for (var k in arr) { 
if (arr[k] > a) { 
a = arr[k]; 
} 
} 
return a; 
} 

function _getMinKey(arr) { 
var a = arr[0]; 
var b = 0; 
for (var k in arr) { 
if (arr[k] < a) { 
a = arr[k]; 
b = k; 
} 
} 
return b; 
} 